
<ion-header class="b-b-shaow" color="winter">

  <ion-navbar>
    <ion-title>购物车</ion-title>
  </ion-navbar>

  <ion-buttons right>
    <button (click)="edit()" [hidden]='isEdit'>编辑</button>
    <button (click)="edit()" class="text-red" [hidden]='!isEdit'>完成</button>
  </ion-buttons>

</ion-header>


<ion-content>
  <!--下拉刷新-->
  <ion-refresher (ionRefresh)="doRefresh($event)" *ngIf="!showNull">
    <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="下拉刷新" refreshingSpinner="circles" refreshingText="加载中...">
    </ion-refresher-content>
  </ion-refresher>

  <ion-grid class='cart-main' *ngFor="let item of goodsList;let i = index;">
    <ion-row>
      <ion-col col-1>
        <ion-checkbox [(ngModel)]="item.isCheck" (click)="updateCheck(item)"></ion-checkbox>
      </ion-col>
      <ion-col col-4 (click)="goGoodsDetail(item)">
        <img  [src]="item.IMAGE_LINK ? item.IMAGE_LINK:'../../../assets/img/goods2.png'" class="pic">
      </ion-col>
      <ion-col>
        <ion-row>
          <ion-col col-12 class='p-l-0'>
						<span class="name">
							{{item.PRODUCT_NAME}}
						</span>
          </ion-col>
          <ion-col col-12 class='p-l-0'>
						<span class="pv">
							PV: +${{item.MP_PV}}
						</span>
          </ion-col>
        </ion-row>
        <ion-row>
          <ion-col col-6 class='p-0 text-red'>
            &yen;&nbsp;{{item.MP_PRICE}}
          </ion-col>
          <ion-col col-6 class='p-0'>
						<span class="num-container">
							<label class="reduce" (click)="reduce(item,i)"><i class="iconfont icon-gouwuche-shuliangjian"></i></label>
							<input type="number" class="number" value="{{item.QTY}}" [(ngModel)]="item.QTY"  (ngModelChange)="inputCheck(item)" >
							<label class="add" (click)="add(item)"><i class="iconfont icon-gouwuche-shuliangjia"></i></label>
						</span>
          </ion-col>
        </ion-row>
      </ion-col>
    </ion-row>
  </ion-grid>

  <!--null data-->
  <div class="show-default" *ngIf="showNull">
    <img src="../../assets/img/bg_null_data.png">
    <p class="message">购物车为空~~</p>
  </div>
</ion-content>


<ion-footer class='cart-footer' *ngIf="!showNull">
  <!-- 全选结算 -->
  <ion-toolbar [hidden]='isEdit'>
    <div class="type-main clearfix">
      <div class="type-number pull-left" (click)="checkAll()">
        <ion-checkbox [(ngModel)]="isAllCheck"></ion-checkbox>
        <span class="all-check">全选</span>
      </div>
      <div class="type-btn pull-right" (click)='settle()'>
        结算({{checkIds.length}})
      </div>
      <div class="total pull-right">
        <div class="number">合计：&yen;{{totalPrice}}</div>
        <div class="pv">PV: +${{totalPv}}</div>
      </div>
    </div>
  </ion-toolbar>

  <!-- 全选删除 -->
  <ion-toolbar [hidden]='!isEdit'>
    <div class="type-main clearfix">
      <div class="type-number pull-left" (click)="checkAll()">
        <ion-checkbox [(ngModel)]="isAllCheck"></ion-checkbox>
        <span class="all-check">全选</span>
      </div>
      <div class="del-btn pull-right" (click)='delAllCheck()'>
        删除
      </div>
    </div>
  </ion-toolbar>
</ion-footer>
